<template>
	<view class="page page-index">
		<fy-dropdown :menuList="menuList">
			<fy-dropdown-item v-model="priceValue" dropdownKey="price" :options="priceOptions" @change="handlerPriceChange"></fy-dropdown-item>
			<fy-dropdown-item v-model="salesValue" dropdownKey="sales" :options="salesOptions" @change="handlerSaleChange"></fy-dropdown-item>
			<fy-dropdown-item v-model="synthesisValue" dropdownKey="synthesis" :options="columnOptions" type="column" @change="handlerColumnChange"></fy-dropdown-item>
		</fy-dropdown>
	</view>
	
	
</template>

<script>
export default {  
	data() {
		return {
			menuList: [ { title: '价格', dropdownKey: 'price' }, { title: '采购量', dropdownKey: 'sales' },{ title: '其他条件', dropdownKey: 'synthesis' }],
			synthesisValue: '',
			columnOptions: [
				{ title: '产地', key: 'type', default: '',content:'', list: [{ text: '全部', value: '0' }, { text: '类型1', value: '2' }, { text: '类型2', value: '1' }] },
				{ title: '采购状态', key: 'status', default: '', content:'', list: [{ text: '全部', value: '0' }, { text: '已结束', value: '1' }, { text: '进行中', value: '2' }] },
			],
			priceValue: '',
			priceOptions: [
				{ label: '由低到高', value: 1 }, { label: '由高到低', value: 2 },
			],
			salesValue: '',
			salesOptions: [{ label: '由小到大', value: 1 }, { label: '由大到小', value: 2 }],
		}
	},
	methods: {
		handlerColumnChange(e) {
			if (e.cancel) return;
			
			this.columnOptions.forEach(item=>{
				item.default = e.data[item.key];
				this.synthesisValue +=e.data[item.key]+","
			})
			this.menuList[2].title = ""
			this.columnOptions.forEach(item=>{
				item.list.forEach(listItem=>{
					if(item.default == listItem.value){
						this.menuList[2].title += listItem.text 
					}
				})
			})
			
			  
			
		},
		handlerSaleChange(e) {
			 this.salesOptions.forEach(item=>{
			 	 if(item.value == e){
					 this.menuList[1].title = item.label
				 }
			 })
		},
		handlerPriceChange(e) {
			this.priceOptions.forEach(item=>{
				 if(item.value == e){
					 this.menuList[0].title = item.label
				 }
			})
		},
	}
}
</script>

<style lang="scss"></style>
